<template>
	<view style="padding-bottom: 180rpx;">
		<view class="activeitf-details plr">
			<bsNavBar title='活动详情'></bsNavBar>
			<u-back-top :scroll-top="scrollTop"></u-back-top>
			<view class="big-title">
				{{activityDetails.title}}
			</view>
			<view class="mb-70">
				<u-image border-radius='12' :fade="true" duration="450" width="100%" height="384rpx" :src="activityDetails.titleImg"
				 mode=""></u-image>
			</view>
			<!-- //热门活动 -->
			<view class="mb-70">
				<hotActList :details='activityDetails'></hotActList>
			</view>
			<view class="mb-70">
				<title :lineShow='true' title="活动详情" :showLine='true'></title>
				<view class="mt-25">
					<u-parse :html="activityDetails.introduction"></u-parse>
				</view>

			</view>
			<view class="mb-70">
				<title :lineShow='true' title="嘉宾信息" :showLine='true'></title>
				<view>
					<guestList :list='activityGuestList'></guestList>
				</view>
			</view>
		</view>
		<bsGap></bsGap>
		<bsCodeImg title='活动二维码' content='分享给好友，一同参加活动' :imgUrl='activityDetails.activityQrcode'></bsCodeImg>
		<subBtn :price='activityDetails.price' @handSub='handSub'></subBtn>
		<sigeModal :templateList='templateList' :details='activityDetails' ref='sigeModal'></sigeModal>
	</view>
</template>

<script>
	import guestList from './components/guest-list.vue'
	import hotActList from './components/hot-act-list.vue'
	import subBtn from './components/sub-btn.vue'
	import title from '@/components/bs-title/bs-title.vue'
	import sigeModal from './components/sign-modal.vue'
	import bsCodeImg from '@/components/bs-code-img/bs-code-img.vue'
	export default {
		components: {
			guestList,
			hotActList,
			subBtn,
			title,
			sigeModal,
			bsCodeImg,

		},
		data() {
			return {
				scrollTop: 0,
				activityId: '',
				activityDetails: {},
				activityGuestList: [],
				templateList:[]
			};
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		async onLoad(e) {
			if(e.id){
				this.activityId = e.id
				await this.init()
			}
			// if (e.row) {
			// 	let row = JSON.parse(e.row)
			// 	this.activityId = row.activityId
			// 	await this.init()
			// }

		},
		methods: {
			async init() {
				let res = await this.$u.api.findActivityById({
					activityId: this.activityId
				})
				this.activityDetails = res
				this.activityDetails = res.activityTable
				this.activityGuestList = res.activityGuestList
				let activitySignUpField = await this.$u.api.activitySignUpField({
					activityId: this.activityId,
				})
				this.templateList = activitySignUpField
			},
			handSub() {
				this.$refs.sigeModal.open()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.activeitf-details {


		.big-title {
			font-size: 40rpx;
			color: #303030;
			margin-top: 46rpx;
			margin-bottom: 60rpx;
		}
	}
</style>
